<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
		<title>
		</title>
		<link rel="stylesheet" href="./Public/Admin/Bootstrap/Css/bootstrap.min.css" />
		<link rel="stylesheet" href="./Public/Admin/Css/common.css" />
		<script type="text/javascript" src="./Public/jquery-1.8.2.min.js"></script>
		<script type="text/javascript" src="./Public/Admin/uploadify/jquery.uploadify.min.js"></script>
		<link rel="stylesheet" type="text/css" href="./Public/Admin/uploadify/uploadify.css">
		<!--载入百度编辑器-->
		<script type="text/javascript" charset="utf-8" src="Public/Admin/ueditor1_4_3/ueditor.config.js"></script>
		<script type="text/javascript" charset="utf-8" src="Public/Admin/ueditor1_4_3/ueditor.all.min.js"></script>
		<script type="text/javascript" charset="utf-8" src="Public/Admin/ueditor1_4_3/lang/zh-cn/zh-cn.js"></script>
		<!--
		载入js验证
		<link rel="stylesheet" href="./Public/Admin/validate/mzyValidate.css">
		<script type="text/javascript" src="./Public/Admin/validate/mzyValidate.js"></script>
		<script type="text/javascript" src="./Public/Admin/validate/jquery-1.11.3.min.js"></script>
		-->
		<style type="text/css">/*去掉uploadify上传按钮的边框*/

.uploadify-button {
	background-color: transparent;
	border: none;
	padding: 0;
}

.uploadify:hover .uploadify-button {
	background-color: transparent;
}

.hide {
	display: none;
}

body {
	margin-bottom: 100px;
}


/*图片*/

#file {
	float: left;
	/*margin-right: 100px;*/
}


/*按钮*/

#uploadList {
	width: 60px;
	/*height: 20px;*/
	margin-left: 235px;
	margin-top: -35px;
}

#files {
	float: left;
}


/*按钮*/

#tatt {
	width: 88px;
	height: 60px;
	/*margin-left: 0px;*/
	/*margin-top: -40px;*/
}</style>
		<script type="text/javascript">
		$(function() {
	//		抓取分类[name='cate_cid']给他一个 改变事件
	$("[name='cate_cid']").change(function() {
			//					然后再给提交上来的tid一个选中事件  再把他存到一个变量里
			var tid = $('option:selected').attr('tid');
			$.ajax({
				//				提交方式
				type:"post",
				//				跳到一个函数方法
				url: "<?php echo U('getTypeAttr')?>",
				//		获得的提交上来的   分类的id  第一个值是变量名   第二个是 提交上来的分类id  把他存到第一个值里面
				data: {
					tid:tid
				},
				//				传出去的数据类型
				dataType:'json',
				//					控制器把数据弄好了  这了就能收到   异步都这样写  前面是方法什么的   用 : 隔开
				success: function(attrModel) {
					//						规格（可选择）
					var spec ="";
					//						属性（不能选择）
					var attr ="";
					//						ajax里面的循环   和foreach循环一样    循环出来的是
					$.each(attrModel, function(k, v) {
						//					判断  attr数据库里面的calss字段等于1的商品 循环判断出来  也就是属于规格的商品
						if (v.class == 1) {
							//								规格
							spec += '<tr class="info">' +
								//									循环 调取数据库里面的thname字段   把下面的字符串都用+号连接上
								'<td>'+v.thname+'</td>' +
								'<td>' +
								//									显示点击的那个数据的id 并找到他里面class等于1的数据 里面的thattr字段的值   显示出来
								'<select name="spec['+v.thid+'][thattr][]"><option value="">请选择</option>';
							//									再循环 thattr字段   也就是填写颜色的那个字段    就会出来一个全是颜色的下拉框
							$.each(v.thattr, function(kk, vv) {
								//										选出来的是 颜色（白色，红色）什么的
								spec += '<option value="'+vv+'">' +vv+ '</option>';
							})
							//									给附加价格一个 新的键值   然后把提交上来的附加价格存进去
							spec += '</select></td><td>附加价格：<input type="text" name="spec[' + v.thid + '][price][]" id="" /></td>' +
								'<td><span class="btn btn-success add-spec">增加规格</span></td></tr>';
//							
						} else { //不等于1  就是属于shuxing的商品
							//									属性
							attr += '<tr class="info">' +
								'<td>' +v.thname+ '</td>' +
								'<td>' +
								//								根据获得的id  找到和id对应的类型属性表里面的数据    还要是class字段的值等于0的  数据     然后显示那个数据的 thattr字段的值
								'<select name="attr['+v.thid+']"><option value="">请选择</option>';
							//							 循环
							$.each(v.thattr, function(kk, vv) {
								//								显示的下拉框里面的东西    就是thattr里面的值
								attr += '<option value="'+vv+'">' +vv+ '</option>';
							});
							attr += '</select></td></tr>';
						}
					});
					//						把spec（也就是上面的 规定spec）添加到页面里面的spec id里面
					$('#spec').html(spec);
					//						把attr（也就是上面的 规定attr）添加到页面里面的attr id里面
					$('#attr').html(attr);
				}
			});
		})
		//			给add-spec也就是增加规格按钮一个点击事件
	$('.add-spec').live('click', function() {
			//				找到父级的tr  也就是按钮的父级tr
			var parentsTr = $(this).parents('tr');
			//				 复制父级的tr
			var cloneTr = parentsTr.clone();
			//				  找到辅助出列的 class里面有add-spec的按钮    然后把它里面的add-spec btn-success（颜色）删除       再把这个颜色添加进去remove-spec btn-danger（颜色）      再把里面的字改成删除规格
			cloneTr.find('.add-spec').removeClass('add-spec btn-success').addClass('remove-spec btn-danger').html('删除规格');
			//				最后把克隆出来的tr插到父级的后面
			parentsTr.after(cloneTr);
		})
		//			给他add-spec个点击事件     因为克隆出来的tr 颜色都变了  所有要抓取他remove-spec
	$('.remove-spec').live('click', function() {
			//				一点击 就抓取当前的 tr  然后就删除
			$(this).parents('tr').remove();
		})
		//			给add-spec也就是增加规格按钮一个点击事件
	$('.add-specc').live('click', function() {
			//				找到父级的tr  也就是按钮的父级tr
			var parentsTr = $(this).parents('tr');
			//				 复制父级的tr
			var cloneTr = parentsTr.clone();
			//				  找到辅助出列的 class里面有add-spec的按钮    然后把它里面的add-spec btn-success（颜色）删除       再把这个颜色添加进去remove-spec btn-danger（颜色）      再把里面的字改成删除规格
			cloneTr.find('.add-specc').removeClass('add-spec btn-success').addClass('remove-spec btn-danger').html('删除属性');
			//				最后把克隆出来的tr插到父级的后面
			parentsTr.after(cloneTr);
		})
		//			给他add-spec个点击事件     因为克隆出来的tr 颜色都变了  所有要抓取他remove-spec
	$('.remove-spec').live('click', function() {
		//				一点击 就抓取当前的 tr  然后就删除
		$(this).parents('tr').remove();
	})
})</script>
	</head>
	<body>
										<!--列表图-->
		<!-- html页面 -->
		<div lab="uploadFile">
			<!--<input id="file" type="file" multiple="true">
			<span>类型: *.jpg,*.png 大小: 2000KB 数量: 1</span>-->
			<script type="text/javascript">$(function() {
			$('#file').uploadify({
						'formData': { //POST数据
							'<?php echo session_name(); ?>' : '<?php echo session_id(); ?>',
							},
							'fileTypeDesc': '上传文件', //上传描述
							'fileTypeExts' : '*.jpg;*.png',
							'swf': '<?php echo __PUBLIC__?>/Admin/uploadify/uploadify.swf',
							'uploader': '<?php echo U('Image')?>',
								'buttonText': '选择文件',
								'fileSizeLimit': '2000KB',
								'uploadLimit': 1, //上传文件数
								'width': 80,
								'height': 30,
								'successTimeout': 10, //等待服务器响应时间
								'removeTimeout': 0.2, //成功显示时间
								'onUploadSuccess': function(file, data, response) {
									//转为json
									data = $.parseJSON(data);
									//获得图片地址
									var imageUrl = data.url;
									var li = "<li><img src='" + imageUrl + "'/><input type='hidden' name='glist' value='" + data.path + "'/></li>";
									$("#uploadList ul").prepend(li);
								}
							});
							});</script>
							</div>
		<!--上传商品图册-->
		<!-- html页面 -->
		<div lab="uploadFile">
			<script type="text/javascript">$(function() {
			$('#files').uploadify({
						'formData': { //POST数据
							'<?php echo session_name(); ?>' : '<?php echo session_id(); ?>',
},
'fileTypeDesc': '上传文件', //上传描述
 'fileTypeExts' : '*.jpg;*.png',
'swf': '<?php echo __PUBLIC__?>/Admin/uploadify/uploadify.swf',
'uploader': '<?php echo U('Images')?>',
	'buttonText': '选择文件',
	'fileSizeLimit': '2000KB',
	'uploadLimit': 10, //上传文件数
	'width': 80,
	'height': 30,
	'successTimeout': 10, //等待服务器响应时间
	'removeTimeout': 0.2, //成功显示时间
	'onUploadSuccess': function(file, data, response) {
		//转为json
		data = $.parseJSON(data);
		//获得图片地址
		var imageUrl = data.url;
		var td = "<td ><img id='tatt' src='" + imageUrl + "'/><input type='hidden' name='satlas[]' value='" + data.path + "'/></td>";
		$("#uploadLists ul").prepend(td);
	}
});
});</script>
		</div>
		<div class="container-fluid">
			<div class="row-fluid">
				<div class="span12">
					<form action="" method='post'>
						<fieldset>
							<legend>
								添加商品
							</legend>
							<table class='table table-bordered table-hover'>
								<thead>
									<tr>
										<th colspan="2" class="btn btn-primary">
											基本信息
										</th>
									</tr>
								</thead>
								<tbody>
									<tr class="info">
										<td>
											所属分类
										</td>
										<td>
											<select name="cate_cid">
												<option value="">
													-请选择-
												</option>
												<?php foreach ($cateModel as $v){?>
												<option value="<?php echo $v['cid']?>" tid='<?php echo $v['type_taid']?>'>
													<?php echo $v['_name']?>
												</option>
												<?php }?>
											</select>
										</td>
									</tr>
									<tr class="info">
										<td>
											所属品牌
										</td>
										<td>
											<select name="brand_bid">
												<option value="">
													-请选择-
												</option>
												<?php foreach ($brandModel as $v){?>
												<option value="<?php echo $v['bid']?>">
													<?php echo $v['bname']?>
												</option>
												<?php }?>
											</select>
										</td>
									</tr>
									<tr class="info">
										<td>
											商品名称
										</td>
										<td>
											<input type="text" name='gname'/>
										</td>
									</tr>
									<tr class="info">
										<td>
											单位
										</td>
										<td>
											<input type="text" name='gunit' value='件'/>
										</td>
									</tr>
									<tr class="info">
										<td>
											市价场
										</td>
										<td>
											<input type="text" name='gmar'/>
										</td>
									</tr>
									<tr class="info">
										<td>
											商城价
										</td>
										<td>
											<input type="text" name='gmall'/>
										</td>
									</tr>
									<tr class="info">
										<td>
											点击次数
										</td>
										<td>
											<input type="text" name='gclick'/>
										</td>
									</tr>
								</tbody>
							</table>
							<p class="btn btn-primary">
								商品属性
							</p>
							<table class="table table-bordered table-hover" id='attr' class="info">
							</table>
							<p class="btn btn-primary">
								商品规格
							</p>
							<table class="table table-bordered table-hover" id='spec'>
							</table>
							<table class='table table-bordered'>
								<tr>
									<th colspan="3" class="btn btn-primary">
										列表图
									</th>
								</tr>
								<tr class="info">
									<td>
										上传图片
									</td>
									<td>
										<input id="file" type="file" multiple="true">
										<br />
										<div id="uploadList">
											<ul>
											</ul>
										</div>
									</td>
									<td id='pic-list'>
									</td>
								</tr>
							</table>
							<table class='table table-bordered'>
								<tr>
									<th colspan="3" class="btn btn-primary">
										商品图册
									</th>
								</tr>
								<tr class="info">
									<td>
										上传图片
									</td>
									<td>
										<input id="files" type="file" multiple="true">
										<td>
											<div id="uploadLists">
												<ul>
												</ul>
											</div>
										</td>
									</td>
									<td id='photo-list'>
									</td>
								</tr>
							</table>
							<table class='table'>
								<tr class="next_show">
									<th class="btn btn-primary">
										商品详细
									</th>
									<!--调用百度编辑器-->
									<script id="editor" type="text/plain" style="width:100%;height:500px;" name="sdeta">
									</script>
									<script>var ue = UE.getEditor('editor');</script>
								</tr>
							</table>
							<table class='table'>
								<tr class="next_show">
									<th class="btn btn-primary">
										售后服务
									</th>
									<!--调用百度编辑器-->
									<script id="editors" type="text/plain" style="width:100%;height:350px;" name="safter">
									</script>
									<script>var ue = UE.getEditor('editors');</script>
								</tr>
							</table>
							<input type="hidden" name='tid' value='0'/>
							<input type="submit" value="确认添加" class="btn btn-primary btn-block btn-large" />
						</fieldset>
					</form>
				</div>
			</div>
		</div>
	</body>
</html>